/**
 * 批量为组件文档添加示例嵌入
 * 
 * 使用方法：
 * node tools/add-examples-to-docs.js
 */

const fs = require('fs');
const path = require('path');

// 组件和对应示例文件的映射
const componentExampleMap = {
  'button': 'button-example.html',
  'card': 'card-example.html',
  'input': 'input-example.html',
  'list': 'list-example.html',
  'text': 'text-example.html',
  'title': 'text-example.html', // title 示例在 text 示例中
  'divider': 'divider-example.html',
  'grid': 'grid-example.html',
  'badge': 'badge-avatar-example.html',
  'avatar': 'badge-avatar-example.html',
  'tag': 'tag-example.html',
  'switch': 'form-example.html',
  'checkbox': 'form-example.html',
  'radio': 'form-example.html',
  'alert': 'feedback-example.html',
  'progress': 'feedback-example.html',
  'loading': 'feedback-example.html',
  'empty': 'feedback-example.html',
  'tooltip': 'feedback-example.html',
  'titlebar': 'titlebar-example.html',
  'tabs': 'tabs-example.html',
  'header': 'text-example.html', // header 示例可能需要单独创建
};

// 示例嵌入模板
const exampleEmbedTemplate = (examplePath, componentName, height = 800) => `
## 在线演示

<div class="example-preview" style="border: 1px solid #e0e0e0; border-radius: 8px; overflow: hidden; margin: 24px 0; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);">
  <iframe 
    src="${examplePath}" 
    width="100%" 
    height="${height}"
    frameborder="0"
    title="${componentName}组件示例"
    loading="lazy">
  </iframe>
</div>

[在新窗口打开完整示例](${examplePath})
`;

// 检查文件是否已有示例嵌入
function hasExampleEmbed(content) {
  return content.includes('example-preview') || 
         content.includes('在线演示') ||
         content.includes('<iframe');
}

// 添加示例到文档
function addExampleToDoc(componentName, exampleFile, docPath) {
  if (!fs.existsSync(docPath)) {
    console.log(`⚠️  文档不存在: ${docPath}`);
    return false;
  }

  let content = fs.readFileSync(docPath, 'utf8');

  // 检查是否已有示例
  if (hasExampleEmbed(content)) {
    console.log(`✓  ${componentName}.md 已有示例，跳过`);
    return false;
  }

  const examplePath = `../../examples/${exampleFile}`;
  const exampleSection = exampleEmbedTemplate(examplePath, componentName);

  // 尝试在"使用示例"之前插入
  if (content.includes('## 使用示例')) {
    content = content.replace(
      /(## 使用示例)/,
      exampleSection + '\n\n$1'
    );
  } 
  // 尝试在"CSS 变量"之前插入
  else if (content.includes('## CSS 变量')) {
    content = content.replace(
      /(## CSS 变量)/,
      exampleSection + '\n\n$1'
    );
  }
  // 尝试在"相关文档"之前插入
  else if (content.includes('## 相关文档')) {
    content = content.replace(
      /(## 相关文档)/,
      exampleSection + '\n\n$1'
    );
  }
  // 如果都没有，在文档末尾添加
  else {
    content += '\n\n' + exampleSection;
  }

  fs.writeFileSync(docPath, content, 'utf8');
  console.log(`✓ 已更新 ${componentName}.md`);
  return true;
}

// 主函数
function main() {
  const docDir = path.join(__dirname, '../doc/components');
  
  console.log('开始为组件文档添加示例嵌入...\n');

  let updatedCount = 0;
  let skippedCount = 0;

  Object.entries(componentExampleMap).forEach(([componentName, exampleFile]) => {
    const docPath = path.join(docDir, `${componentName}.md`);
    
    if (fs.existsSync(docPath)) {
      const updated = addExampleToDoc(componentName, exampleFile, docPath);
      if (updated) {
        updatedCount++;
      } else {
        skippedCount++;
      }
    } else {
      console.log(`⚠️  文档不存在: ${componentName}.md`);
    }
  });

  console.log(`\n完成！`);
  console.log(`✓ 已更新: ${updatedCount} 个文档`);
  console.log(`- 已跳过: ${skippedCount} 个文档`);
}

// 如果直接运行此脚本
if (require.main === module) {
  main();
}

module.exports = { addExampleToDoc, exampleEmbedTemplate };

